<template>
  <div class="page" v-if="data.questionId!=undefined">
    <!-- tip -->
    <div class="testTime">
      <span class="left">倒计时：
        <b>{{Dtime}}</b>
      </span>
      <span class="right">
        <em class="v">{{data.questionId+1}}</em>题目:{{data.questionId+1}}/{{data.questions_total}}</span>
    </div>
    <!-- box -->
    <div class="testBox2">
      <h3>题目</h3>
      <div class="tmContent">
        {{data.question.title}}
      </div>
      <h3 v-if="data.question.type=='1'">题型:单选</h3>
      <h3 v-if="data.question.type=='2'">题型:多选</h3>
      <h3 v-if="data.question.type=='3'">题型:是非</h3>
      <div class="tmContent">
        <!-- 单选 -->
        <van-radio-group v-model="checkbox_radio" v-if="data.question.type!='2'">
          <table class="testTable">
            <tr v-for="item in data.question.options">
              <td class="input">
                <van-radio :name="item.value" />
              </td>
              <td>{{item.answer}}</td>
            </tr>
          </table>
        </van-radio-group>
        <!-- 多选 -->
        <van-checkbox-group v-model="checkbox_radio" v-if="data.question.type=='2'">
          <table class="testTable">
            <tr v-for="item in data.question.options">
              <td class="input">
                <van-checkbox :name="item.value"></van-checkbox>
              </td>
              <td>{{item.answer}}</td>
            </tr>
          </table>
        </van-checkbox-group>
      </div>
    </div>
    <!-- msg -->
    <div class="msg">
      <em>*</em>
      请注意：答题后，直接点击“下一题”，所有题目答完后在点击“交卷”
    </div>
    <!-- btn -->
    <div class="btnBox">
      <a class="a2" @click="nextData('pre')" v-if="data.questionId!=0">上一题</a>
      <a class="a2 a3" v-if="data.questionId==0">上一题</a>
      <a class="a2" @click="next" v-if="data.questionId!=data.questions_total-1">下一题</a>
      <a class="a2" @click="next" v-if="data.questionId==data.questions_total-1">交卷</a>
    </div>
  </div>
</template>

<script>
import { Dialog } from "vant";
import { Toast } from 'vant'
var set;
export default {
  data() {
    return {
      checkbox_radio:[],
      Dtime: 0,
      data:{}
    };
  },
  mounted: function() {
    maxusJSB.tojson({title:"模拟考试",left:"关闭"})
    this.getData();
    this.gettime()
  },
   beforeDestroy: function () {
     clearInterval(set) 
     Toast.clear()
   },
  methods: {
    // 请求列表
    getData() {
      this.$http
        .post(
          "?key=&request=front&operation=start-exam&client=1&by=admin&id=" +
            this.$route.query.id +
            "&user_id="+this.getUserID
        )
        .then(response => {
          if (response.ret==1) {
            this.data = response.data;
            this.countDown(parseInt(response.data.duration) * 60);
          }
        });
    },
     // 计时
    gettime() {
      var that=this
      set=setInterval(function() {
        that.$http
        .post(
          "/event/exam?client=2&key=&test_id="+
            that.$route.query.id +"&user_id="+that.getUserID+"&guid="+that.data.testedId 
        );
      },5000)
    },
    // 下一步上一步
    nextData(operate) {
Toast.loading({
  mask: true,
  message: '加载中...',
  duration:0
});
      if(this.data.questionId==this.data.questions_total-1){
        this.$router.push({path: '/testReport',query:{ id:this.$route.query.id,questionId:this.data.questionNo,answer:this.checkbox_radio}});
      }else{
      this.$http
        .post(
          "?key=&request=front&operation=accept-answer&client=1&by=admin",
          "user_id="+this.getUserID+"&id="+this.$route.query.id+"&answer="+this.checkbox_radio+"&operate="+operate+"&questionId="+this.data.questionNo
        )
        .then(response => {
          Toast.clear()
            //判断答题完成
            this.checkbox_radio=[]
            this.data = response.data;
            if(response.data.question.user_answer!=""){
            // 判断多选默认答案数组转字符串
            if(response.data.question.type==2){
              this.checkbox_radio=response.data.question.user_answer.split(",")
            }else{
              this.checkbox_radio=response.data.question.user_answer
            } 
            }       
        })
      }
    },
    // 倒计时（秒）
    countDown(times) {
      var that = this;
      var timer = null;
      timer = setInterval(function() {
        var day = 0,
          hour = 0,
          minute = 0,
          second = 0; //时间默认值
        if (times > 0) {
          day = Math.floor(times / (60 * 60 * 24));
          hour = Math.floor(times / (60 * 60)) - day * 24;
          minute = Math.floor(times / 60) - day * 24 * 60 - hour * 60;
          second =
            Math.floor(times) -
            day * 24 * 60 * 60 -
            hour * 60 * 60 -
            minute * 60;
        }
        if (day <= 9) day = "0" + day;
        if (hour <= 9) hour = "0" + hour;
        if (minute <= 9) minute = "0" + minute;
        if (second <= 9) second = "0" + second;
        //
        that.Dtime = minute + ":" + second;
        times--;
      }, 1000);
      if (times <= 0) {
        clearInterval(timer);
      }
    },
    next() {
      console.log()
      if (this.checkbox_radio.length == 0) {
        Dialog.alert({
          message: "你还没有选择答案"
        })
      }else{
        if(this.checkbox_radio instanceof Array){
          this.checkbox_radio=this.checkbox_radio.join(',')
        }
        this.nextData("next")
      }
    }
  }
};
</script>

<style>
</style>